//<![CDATA[
// Check to see if this browser can run the Google API
if (GBrowserIsCompatible()) {
  // A function to create the marker and set up the event window
  // Dont try to unroll this function. It has to be here for the function closure
  // Each instance of the function preserves the contends of a different instance
  // of the "marker" and "html" variables which will be needed later when the event triggers.    
  function createMarker(point,html) {
    var marker = new GMarker(point);
    GEvent.addListener(marker, "click", function() {
      marker.openInfoWindowHtml(html);
    });
    return marker;
  }

  // Display the map, with some controls and set the initial location 
  var map = new GMap2(document.getElementById("map"));

  // ====== Restricting the range of Zoom Levels =====
  // Get the list of map types      
  var mt = map.getMapTypes();
  // Overwrite the getMinimumResolution() and getMaximumResolution() methods
  for (var i=0; i<mt.length; i++) {	//higher values for resolution, 17 seems to be good for nearest neighbour, 15 for overview
    mt[i].getMinimumResolution = function() {return 13;}
    mt[i].getMaximumResolution = function() {return 20;}	// 20 is max zoom of google maps
  }


  map.addControl(new GLargeMapControl());
  map.addControl(new GMapTypeControl());
  map.setCenter(new GLatLng(52.375618 ,4.896255), 7, G_SATELLITE_MAP);	// latitude and longitude of damrak
  

  // Set up markers with info windows 
  GDownloadUrl("../MarkerData.xml", function (doc) {
    var xmlDoc = GXml.parse(doc);
    var markers = xmlDoc.documentElement.getElementsByTagName("marker");
      
    for (var i = 0; i < markers.length; i++) {
      // obtain the attribues of each marker
      var lat = parseFloat(markers[i].getAttribute("lat"));
      var lng = parseFloat(markers[i].getAttribute("lng"));
      var point = new GLatLng(lat,lng);
      var html = markers[i].getAttribute("html");
      var label = markers[i].getAttribute("label");
      // create the marker
      var marker = createMarker(point,html,label);
      map.addOverlay(marker);
    }
    // ===== final part of the select box =====
    select_html += '<\/select>';
    document.getElementById("selection").innerHTML = select_html;
  });
  
  
  
  // Add a move listener to restrict the bounds range
  GEvent.addListener(map, "move", function() {
    checkBounds();
  });

  // The allowed region which the whole map must be within
  var allowedBounds = new GLatLngBounds(new GLatLng(52.365617 ,4.886254), new GLatLng(52.385619 ,4.906256));
  
  // If the map position is out of range, move it back
  function checkBounds() {
    // Perform the check and return if OK
    if (allowedBounds.contains(map.getCenter())) {
      return;
    }
    // It`s not OK, so find the nearest allowed point and move there
    var C = map.getCenter();
    var X = C.lng();
    var Y = C.lat();

    var AmaxX = allowedBounds.getNorthEast().lng();
    var AmaxY = allowedBounds.getNorthEast().lat();
    var AminX = allowedBounds.getSouthWest().lng();
    var AminY = allowedBounds.getSouthWest().lat();

    if (X < AminX) {X = AminX;}
    if (X > AmaxX) {X = AmaxX;}
    if (Y < AminY) {Y = AminY;}
    if (Y > AmaxY) {Y = AmaxY;}
    //alert ("Restricting "+Y+" "+X);
    map.setCenter(new GLatLng(Y,X));
  }
}

// display a warning if the browser was not compatible
else {
  alert("Sorry, the Google Maps API is not compatible with this browser");
}

// This Javascript is based on code provided by the
// Community Church Javascript Team
// http://www.bisphamchurch.org.uk/   
// http://econym.org.uk/gmap/

//]]>
